﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Admin.Master" Inherits="System.Web.Mvc.ViewPage<OGS.Web.Models.Admin.SaveUserModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    <%= OGS.Utility.Helper.GetPageTitle("Save User") %>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <link href="../../../Css/jQueryUI/jquery-ui-1.10.3.custom.css" rel="stylesheet" />

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
    
    <script type="text/javascript">

        // Auto complete location textbox
        var geocoder;
        var map;
        var marker;
        $(document).ready(function () {
            initialize();
            $(function () {
                $("#searchbox").autocomplete({
                    // + ', UK'
                    //This bit uses the geocoder to fetch address values
                    source: function (request, response) {
                        geocoder.geocode({ 'address': request.term, 'region': 'UK' }, function (results, status) {
                            response($.map(results, function (item) {
                                return {
                                    label: item.formatted_address,
                                    value: item.formatted_address,
                                    latitude: item.geometry.location.lat(),
                                    longitude: item.geometry.location.lng()
                                }
                            }));
                        })
                    },
                    //This bit is executed upon selection of an address
                    select: function (event, ui) {
                        $("#latitude").val(ui.item.latitude);
                        $("#longitude").val(ui.item.longitude);
                        var pos = ui.item.position;
                        var lct = ui.item.locType;
                        var bounds = ui.item.bounds;
                        if (bounds) {
                            map.fitBounds(bounds);
                        }
                        var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
                        marker.setPosition(location);
                        map.setCenter(location);
                    }
                });
            })

            // Auto complete location textbox
            $("#zipcode").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        type: "GET",
                        url: "/Admin/GetPostalCodes",
                        dataType: "json",
                        data: {
                            PostalCode: request.term
                        },
                        success: function (data) {
                            var parsed = JSON.parse(data);
                            response(parsed);
                        },
                        error: function () {
                            alert('error');
                        }
                    });
                },
                minLength: 3,
                select: function (event, ui) {
                    $("#zipcode").val(ui.item.label);
                    $('#areacode').html('');
                    $.ajax({
                        type: "GET",
                        url: "/Admin/GetAreaByPostalCodes",
                        dataType: "json",
                        data: {
                            PostalCode: ui.item.label
                        },
                        success: function (data) {
                            var parsed = JSON.parse(data);
                            for (i in parsed) {
                                var newOption = "<option value='" + parsed[i].AreaName + "'>" + parsed[i].AreaName + "</option>";
                                $("#areacode").append(newOption);

                                $('#state').val(parsed[i].State);
                            }
                        },
                        error: function () {
                        }
                    });                    
                },
                open: function () {
                    $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
                },
                close: function () {
                    $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
                }
            });
        });

        function initialize() {
            //MAP
            //41.659, -4.714
            var latlng = new google.maps.LatLng(54.30, -2.10);
            var options = {
                zoom: 5,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            map = new google.maps.Map(document.getElementById("map"), options);

            //GEOCODER
            geocoder = new google.maps.Geocoder();

            marker = new google.maps.Marker({
                map: map,
                draggable: true
            });

        }
    </script>
    <style>
  .ui-autocomplete-loading {
    background: white url("../../../Images/ui-anim_basic_16x16.gif") right center no-repeat;
  }
  #city { width: 25em; }
  </style>
    <%-- Main content--%>
    <section class="content">
        <div id="mapcontainer" style="visibility: hidden">
            <div id="map">
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <ol class="breadcrumb">
                    <li><a href="/admin/manage-dashboard">Home</a></li>
                    <li><a href="/admin/user-list">User List</a></li>
                    <li class="active">Save User</li>
                </ol>
            </div>
            <div class="col-md-8 col-md-offset-2">
                <% using (Html.BeginForm())
                   { %>
                <%: Html.AntiForgeryToken() %>
                <%: Html.HiddenFor(m => m.ID) %>
                <%: Html.HiddenFor(m=>m.Latitude, new { @id="latitude"}) %>
                <%: Html.HiddenFor(m=>m.Longitude, new { @id="longitude"}) %>
                <div class="well well-White">
                    <div class="bs-example form-horizontal">
                        <fieldset>
                            <legend>Save User</legend>
                            <% if (Model.IsSuccess)
                               { %>
                            <div class="alert alert-success">
                                <a href="#" class="close" data-dismiss="alert">&times;</a>
                                <strong>Success!</strong> User saved successfully. <a href="/admin/save-Brand">Click here </a>to add new.
                            </div>
                            <% } %>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Name, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Name, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Name) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Email, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Email, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Email) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Phone, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Phone, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Phone) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Username, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Username, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Username) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Password, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.PasswordFor(m => m.Password, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Password) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.ConfirmPassword, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.PasswordFor(m => m.ConfirmPassword, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.ConfirmPassword) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Shopname, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Shopname, new { @class = "form-control", @maxlength = "100" })%>
                                    <%: Html.ValidationMessageFor(m => m.Shopname) %>
                                </div>
                            </div>

                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Address, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextAreaFor(m => m.Address, new { @class = "form-control", @maxlength = "500" })%>
                                    <%: Html.ValidationMessageFor(m => m.Address) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Landmark, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Landmark, new { @class = "form-control", @maxlength = "100" })%>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Zip, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Zip, new { @class = "form-control", @maxlength = "100", @id="zipcode" })%>
                                    <%: Html.ValidationMessageFor(m => m.Zip) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Area, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.DropDownListFor(m => m.Area,Enumerable.Empty< SelectListItem >(), new { @class = "form-control", @maxlength = "100", @id="areacode" })%>
                                    <%: Html.ValidationMessageFor(m => m.Area) %>
                                </div>
                            </div>
                             <div class="form-group">
                                <%: Html.LabelFor(m => m.State, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.State, new { @class = "form-control", @maxlength = "100", @id="state" })%>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.Location, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.TextBoxFor(m => m.Location, new { @class = "form-control", @maxlength = "100", @id = "searchbox" })%>
                                    <%: Html.ValidationMessageFor(m => m.Location) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.RoleID, new { @class="col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.DropDownListFor(m => m.RoleID, new SelectList(Model.Role, "RoleID", "Name"), new { @class = "form-control" })%>
                                    <%: Html.ValidationMessageFor(m => m.RoleID) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.IsActive, new { @class = "col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.CheckBoxFor(m => m.IsActive) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <%: Html.LabelFor(m => m.IsBlocked, new { @class = "col-lg-3 control-label" })%>
                                <div class="col-lg-9">
                                    <%: Html.CheckBoxFor(m => m.IsBlocked) %>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-lg-9 col-lg-offset-3">
                                    <input type="submit" class="btn btn-primary" value="Save" />
                                    <a href="/admin/user-list" class="btn btn-default">Cancel</a>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                </div>
                <% } %>
            </div>
        </div>
    </section>
    <%--/.content --%>
    <script type="text/javascript">
        $(document).ready(function () {
            //enable validation
            enableValidation();
        });
    </script>
</asp:Content>
